<template>
  <div class="checked-pane">
    <el-card style="height: 30vh" shadow="hover">
      <template #header> <label>已检项目</label> </template>
      <div v-if="checkedList.length > 0">
        <el-scrollbar max-height="20vh">
          <el-table :data="checkedList" style="width: 100%">
            <el-table-column prop="id" label="ID" width="180" />
            <el-table-column prop="name" label="项目名" width="180" />
            <el-table-column prop="queueingDeptId" label="科室" width="180">
              <template #default="scope">
                {{
                  scope.row.deptList.find(
                    (dept) => dept.id === scope.row.queueingDeptId
                  )?.name
                }}
              </template>
            </el-table-column>
            <el-table-column prop="docName" label="医生姓名" width="180" />
            <el-table-column prop="duration" label="耗时">
              <template #default="scope">
                {{ Math.floor(scope.row.duration / 60.0) }} min
              </template>
            </el-table-column>
          </el-table>
        </el-scrollbar>
      </div>
      <el-empty image-size="50" v-else description="暂无已检项目" />
    </el-card>
  </div>
</template>

<script setup lang="ts">
import { ICheckProject } from "@/api/queue/types";
import { PropType } from "vue";
import CheckCard from "@/views/client/patient/components/check-card.vue";

const props = defineProps({
  checkedList: {
    type: Array as PropType<ICheckProject[]>,
    required: true,
  },
});
</script>

<style scoped lang="scss">
.checked-pane {
}
</style>
